<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">

  <title>radio</title>
<script>
	window.onload = function(){
		var btn = document.getElementById("btnChk");
		btn.onclick = function(){
			var len = frm.chk.length;
			for(i=0; i<len; i++){
				if(frm.chk[i].checked){
					var c = frm.chk[i].value;
					frm.re.style.backgroundColor = c;
					frm.re.value = c;
					break;
				}
			}
		}
	}
</script>
</head>

<body style="font-family: 나눔고딕; background-image: url(../images/pattern3.png); text-align: center;">
  <h1 style="color: #5CD1E5; -webkit-text-stroke: 1px white;">라디오 놀이</h1>
  <form name="frm" action="" method="post">
	  <textarea rows="5" cols="17" name="re"></textarea><p/>
	  <label><input type="radio" name="chk" value="#000000" />검정</label>
	  <label><input type="radio" name="chk" value="#BCE55C" />연두</label><br/>
	  <label><input type="radio" name="chk" value="#F2CB61" />노랑</label>
	  <label><input type="radio" name="chk" value="#FF0000" />빨강</label><br/>
	  <label><input type="radio" name="chk" value="#8041D9" />보라</label>
	  <label><input type="radio" name="chk" value="#F361A6" />핑크</label><br/><br/>
	  <input type="button" id="btnChk" value="CLICK" style="width: 110px; height: 30px; background-color: red; color: white; font-weight: bold;"/>
  </form>
</body>
</html>
